/*
  学习目标：了解-React组件更新机制
  步骤：
     1. 父组件更新, 后代组件全部更新
     2. 组件更新, 不会影响兄弟组件
*/

import React from 'react';
export default class App extends React.Component {
  render() {
    return (
      <div>
        <Footer />
        <Footer2 />
      </div>
    );
  }
}

class Footer2 extends React.Component {
  componentDidUpdate() {
    console.log('Footer被更新了  ----->  ');
  }
  render() {
    return <div>Footer2</div>;
  }
}

class Footer extends React.Component {
  state = {
    count: 0,
  };

  handleClick = () => {
    this.setState({ count: this.state.count + 1 });
  };

  render() {
    return (
      <div>
        我是Footer
        <button onClick={this.handleClick}>点我修改数量</button>
      </div>
    );
  }
}
